<template>
  <b-container>
    <div
      v-show="show"
      class="middle-box text-center animate__bounceIn"
      :class="{animate__animated: show ? true : false}"
    >
        <h1>404</h1>
        <h3 class="font-bold">页面未找到！</h3>
        <div class="error-desc">
          抱歉，页面好像去火星了~
        </div>
    </div>
  </b-container>
</template>

<script >
export default {
  name: 'error404',
  layout: 'error',
  data () {
    return {
      show: false
    }
  },
  created () {
    this.show = true
  }
}
</script>

<style lang="scss" scoped>
.container{
  padding-top: 100px;
}
</style>
